<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>管理标签</title>
    <link rel="icon" href="/images/logo.ico"/>
    <link rel="stylesheet" href="/lib/semantic/semantic.min.css">
    <link rel="stylesheet" href="/css/me.css">
    <link rel="stylesheet" href="/lib/animate/animate.min.css">
    <link rel="stylesheet" href="/css/style.css">
</head>
<body class="m-back-img1">
<!--导航-->
<!--导航-->
<nav class="ui inverted attached segment m-padded-tb-mini m-shadow-small animated fadeInDown m-opacity"
     style="z-index: 99 !important;">
    <div class="ui container">
        <div class="ui inverted secondary stackable  menu">  <!--stackable 可堆叠的 应用在移动端-->
            <h2 class="ui teal header item">后台管理</h2>
            <a href="/" class=" nav_item item m-mobile-hide"><i class="coffee icon"></i>博客首页</a>
            <a href="/back/index.html" class=" nav_item item m-mobile-hide "><i class="home icon"></i>管理首页</a>
            <a href="/back/blogs.html" class=" nav_item item m-mobile-hide"><i class="book icon"></i>博客</a>
            <a href="/back/types.html" class="nav_item item m-mobile-hide"><i class="idea icon"></i>分类</a>
            <a href="/back/tags.html" class="nav_item item m-mobile-hide"><i class="tags icon"></i>标签</a>
            <div class="nav_item right dropdown  menu m-mobile-hide">
                <div class="ui dropdown item">
                    <div class="text">
                        <img id="avatar" class="ui avatar image" src="/images/avatar/zry.jpg" alt="">
                        <span id="nickname">猫喵喵</span>
                    </div>

                    <i class="dropdown icon"></i>
                    <div class="menu element-ui dialog" style="z-index: 999 !important;">
                        <a href="/back/user.html" class="item">个人信息</a>
                        <a onclick="logout()"   class="item">注销</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <a href="#" id="menu_toggle" class="ui black button m-mobile-show m-top-right ">
        <i class="sidebar icon"></i>
    </a>
</nav>

<!--中间内容-->
<div style=" padding-top: 9em !important; padding-bottom: 9em !important;"
     class=" m-padded-tb-best   m-container-small ">
    <div class="ui container">
        <div class="ui form">
            <input type="hidden" id="tagId" value="-99" >
            <div class="field">
                <div class="ui left labeled input">
                    <label class="ui teal basic label">名称</label>
                    <input id="tagName" type="text" placeholder="填入你想要新增的标签">
                </div>
            </div>

            <div class="ui error message"></div>

            <div class=" ui right aligned container">
                <!--返回上一页面-->
                <a href="/back/tags.html" class="ui button" >返回</a>
                <button id="submit" class="ui teal button">提交</button>
            </div>

        </div>

    </div>

</div>
<!--底部footer-->
<footer class="ui inverted vertical segment m-padded-tb-massive">
    <!--    居中-->
    <div class="ui center aligned container">
        <div class="ui inverted divided stackable grid">
            <div class="three wide column">
                <div class="ui inverted link list">
                    <div class="item">
                        <img src="../../images/weixin.png"
                             class="ui rounded image" alt="" width="110px">
                    </div>
                </div>
            </div>
            <div class="three wide column">
                <h4 class="ui inverted header">最新博客</h4>
            </div>
            <div class="three wide column">
                <h4 class="ui inverted header">联系我</h4>
                <div class="ui inverted link list m-text-thin m-text-spaced">
                    <a href="#" class="item">Email：123456@qq.com</a>
                    <a href="#" class="item">QQ:123456789</a>
                </div>
            </div>
            <div class="seven wide column">
                <h4 class="ui inverted header">Blog</h4>
                <p class="m-text-thin m-text-spaced m-opacity">
                    这厮我的个人博客，会分享关于编程，思考，随笔相关的内容，欢迎大家访问，希望可以给到这的人有所帮助...
                </p>
            </div>
        </div>
        <div class="ui inverted section divider"></div>
        <p class="m-text-thin m-text-spaced m-opacity-tiny">Copyright © 2021-2022 . All rights reserved.</p>
        <div>
            <a target="_blank" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode="
               style="display:inline-block;text-decoration:none;height:20px;line-height:20px;"><img
                    src="https://beian.mps.gov.cn/favicon.ico" style="float:left;">
                <p style="float:left;height:20px;line-height:20px;margin: 0px 0px 0px 5px; color:#ff1c04;">京ICP备
                    XXXXXXXXXX号</p></a>
        </div>
    </div>

</footer>
</body>
<!-- jquery -->
<script src="/js/jquery-3.6.0.min.js"></script>
<!-- semantic-ui-->
<script type="text/javascript" src="/lib/semantic/semantic.min.js"></script>
<!-- layer -->
<script type="text/javascript" src="/lib/layer/layer.js"></script>
<!--comment.js-->
<script type="text/javascript" src="/js/common.js"></script>
<script type="text/javascript">
    $(".ui.dropdown").dropdown({
        on: "hover"
    });
    $(function () {
        getUserInfo();
        setTagName();
        function setTagName() {
            let id =g_getQueryString("tagId");
            if(id==null || id.length===0){
                return;
            }
            $.ajax({
                url: "/admin/tags/"+id,
                type: "GET",
                async: false,
                success: function (res) {
                    layer.closeAll();
                    if (res.code === 200) {
                        $('#tagName').val(res.data.name);
                    } else {
                        layer.msg(res.msg);
                    }
                },
                error: function (res) {
                    console.log("error");
                    layer.closeAll();
                }
            });
        }
    });


    $("#submit").click(function(){
            //获取url
        let id =g_getQueryString("tagId");
            if(id==null || id.length===0){
                postTag();
            }else {
                updateTag(id);
            }
        });

    function updateTag(id) {
        var tagName = $("#tagName").val();
        if (tagName.length == 0) {
            layer.msg("分类不能为空");
            return;
        }
        $.ajax({
            url: "/admin/tags/"+id,
            type: "PUT",
            data: JSON.stringify({
                name: tagName,
            }),
            dataType: "json",
            contentType: "application/json;charset=UTF-8",
            async: false,
            success: function (res) {
                layer.closeAll();
                    layer.msg(res.msg);
            },
            error: function (obj) {
                console.log("error");
                layer.closeAll();
            }
        });
    }

    function postTag() {
        var tagName = $("#tagName").val();
        if (tagName.length == 0) {
            layer.msg("分类不能为空");
            return;
        }
        $.ajax({
            url: "/admin/tags",
            type: "POST",
            data: JSON.stringify({
                name: tagName,
            }),
            dataType: "json",
            contentType: "application/json;charset=UTF-8",
            async: false,
            success: function (res) {
                layer.closeAll();
                if (res.code === 201) {
                    layer.msg(res.msg);
                    $("#tagName").val('');
                } else {
                    layer.msg(res.msg);
                }
            },
            error: function (obj) {
                console.log("error");
                layer.closeAll();
            }
        });
    };


</script>

</html>